<template>
  <div>
    <el-col :span="24" class="bg1">
      <div class="grid-content bg-purple">
        <FormPanel ref="formPanel" :list="formList" :cols="1" :labelWidth="120" :isSubmitBtn="false" @formChange="formChangeHandle"/>
      </div>
    </el-col>

    <div class="dialogBottmView">
      <multiuse-button type="primary" :click="saveDialog.bind()">保 存</multiuse-button>
      <el-button size="small" type="primary" class="btnStyle" @click="closeMenu('3')">关闭
      </el-button>

    </div>
    <BaseDialog :visible.sync="partVisible" :title="'备件选择'" destroyOnClose width="850px" :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}">
      <Vehicle @close="close" @save="partSave"></Vehicle>
    </BaseDialog>

  </div>
</template>

<script>
import {
  addAssembly, assemblyAndRegulationsListRecordNew,
  editAssembly, editAssemblyPart,
  getByAssemblyId, getByAssemblyPartId,
  getByThreeId,
  listRecordNew,
  updateMaintain
} from '@/api/repair/threePacksOfManager/regulationsQueryCDuan';
import Vehicle from '@/pages/claimDemage/tools/vehicle.vue';


import {dictionary} from '@/utils/dictMixin';
import {isEmpty} from '@/utils/utils';
import {exportExcelFile} from '@/utils/index';

export default {
  name: 'detail',
  mixins: [dictionary],
  /*handleType show   活动审核  show-1  索赔审核*/
  props: ['handleType', 'partId'],
  data()
  {
    this.saveData = null;
    return {
      assemblyId: null,
      formList: this.createFormList(),
      detailObj: {},
      partVisible: false,
    };
  },
  components: {Vehicle},
  async mounted()
  {
    let res = await assemblyAndRegulationsListRecordNew({
      isDeleted: 0,
      pageNum: 1,
      currentPage: 1,
      pageSize: 99999,
      limit: 99999,
    });
    if (res.resultCode === 200) {
      this.formList.find(x=>x.fieldName=='assemblyCode').itemList = res.data.records.map(y => ({ text: y.assemblyCode, value: y.assemblyCode }));
    }
    await this.getData();
  },
  methods: {
    async partSave(obj) {
      console.log(obj);
      this.formList.find(x => x.fieldName == 'partNo').initialValue = obj[0].partCode;
      this.formList.find(x => x.fieldName == 'partName').initialValue = obj[0].partName;
      this.partVisible = false;
    },
    chooseOrderNo() {
      this.partVisible = true;
    },
    close() {
      this.partVisible = false;
    },
    formChangeHandle(val) {
      this.saveData = val;
    },
    //保存
    async saveDialog() {
      let err = this.$refs.formPanel.submitForm();
      if (err) {
        // this.$notify.error({ title: '提示信息', message: '请检查提交数据' });
        return;
      }
      this.saveData.partId = this.partId;
      this.saveData.assemblyId = this.assemblyId;
      let params = Object.assign({}, this.saveData);
      let res = await editAssemblyPart(params);
      console.log(res);
      if (res.resultCode === 200) {
        this.$emit('save');
        return this.$notify.success({ title: '提示信息', message: '保存成功' });
      } else {
        this.loading = false;
        this.$notify.error({ title: '提示信息', message: res.errMsg || '保存失败!' });
      }
      this.loading = false;
    },
    /*根据ID查询*/
    async getData()
    {
      let res = await getByAssemblyPartId({'id': this.partId});
      if (res.resultCode == 200 && res.success == true)
      {
        this.assemblyId = res.data.assemblyId;
        let data = isEmpty(res['data']) ? {} : res['data'];

        for (let i in data)
        {
          this.formList.map(x =>
          {
            if (i == x.fieldName)
            {
              x.initialValue = data[i];
            }
          });
        }
      }

    },
    async closeMenu(type)
    {
      this.$emit('close')
    },

    createFormList()
    {

      return [
        {
          type: 'SELECT',
          label: '总成编号',
          fieldName: 'assemblyCode',
          placeholder: '请选择规则编号...',
          style: {width: '230px'},
          // rules: [{required: true, message: '请选择规则编号', trigger: 'change'}],
          itemList: [],
          disabled: true
        },
        {
          type: 'INPUT',
          label: '总成名称',
          fieldName: 'assemblyName',
          placeholder: '请输入总成名称...',
          style: {width: '230px'},
          disabled: true
        },
        {
          type: 'INPUT',
          label: '备件编号',
          fieldName: 'partNo',
          placeholder: '请输入备件编号...',
          style: {width: '230px'},
          rules: [{required: true, message: '请输入备件编号', trigger: 'change'}],
          unitRender: p => {
            return (
              <div>
                <multiuse-button icon="el-icon-search" onClick={() => this.chooseOrderNo()} />
              </div>
            );
          }
        },
        {
          type: 'INPUT',
          label: '备件名称',
          fieldName: 'partName',
          placeholder: '请输入备件名称...',
          style: {width: '230px'},
          rules: [{required: true, message: '请输入备件名称', trigger: 'change'}],
          disabled: true
        },
        {
          type: 'TEXT_AREA',
          label: '关系描述',
          fieldName: 'remarks',
          placeholder: '请输入关系描述',
          rules: [{required: true, message: '请输入关系描述', trigger: 'change'}],
          initialValue: '',
          style: {width: '400px'},
        }
      ];
    },
  }
};
</script>

<!--<style scoped lang="less">-->
<!--  .bg1 {-->
<!--    border: 1px solid @borderColor;-->
<!--    border-radius: @borderRadius;-->
<!--    box-shadow: @boxShadow;-->
<!--    padding: @modulePadding;-->
<!--    padding-left: 0;-->
<!--    padding-top: 15px;-->
<!--    padding-bottom: 15px;-->
<!--  }-->

<!--  .bg2 {-->
<!--    margin-top: 10px;-->
<!--    margin-bottom: 10px;-->
<!--  }-->

<!--  .btn {-->
<!--    text-align: center;-->
<!--  }-->

<!--  .btnStyle {-->
<!--    margin-top: 10px;-->
<!--  }-->
<!--</style>-->
